<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>AdminLTE 3 | 编辑-游客列表</title>
    <jsp:include page="../include/css.jsp"></jsp:include>
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <jsp:include page="../include/header.jsp"></jsp:include>

    <jsp:include page="../include/left.jsp"></jsp:include>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>订单管理</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="#">首页</a></li>
                            <li class="breadcrumb-item active">订单管理</li>
                        </ol>
                    </div>
                </div>
            </div><!-- /.container-fluid -->
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">
                                <h1>订单id: ${order.id}</h1>
                                <button onclick="toAdd()" style="width: 80px"  type="button" class="btn btn-block btn-success btn-lg" >添加</button>
                                <%--<form class="form-inline ml-3" action="/tourist/list" method="get">--%>
                                    <%--<div class="input-group input-group-sm">--%>
                                        <%--<input value="${myParams.keywords}" name="keywords"--%>
                                               <%--class="form-control form-control-navbar" type="search" placeholder="搜索"--%>
                                               <%--aria-label="Search">--%>
                                        <%--<div class="input-group-append">--%>
                                            <%--<button class="btn btn-navbar" type="submit">--%>
                                                <%--<i class="fas fa-search"></i>--%>
                                            <%--</button>--%>
                                        <%--</div>--%>
                                    <%--</div>--%>
                                <%--</form>--%>
                            </div>
                            <!-- /.card-header -->
                            <div class="card-body">
                                <table id="example2" class="table table-bordered table-hover">
                                    <thead>
                                    <tr>
                                        <th>id</th>
                                        <th>游客姓名</th>
                                        <th>出生日期</th>
                                        <th>游客电话</th>
                                        <th>游客身份证</th>
                                        <th>编辑</th>
                                    </tr>
                                    </thead>
                                    <tbody id="tbody-data">

                                    </tbody>
                                </table>

                            </div>
                            <!-- /.card-body -->
                        </div>
                        <!-- /.card -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
    <jsp:include page="../include/footer.jsp"></jsp:include>
    <!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->

<!-- jQuery -->
<script src="../../plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- DataTables -->
<script src="../../plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../../plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="../../plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="../../plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
<!-- AdminLTE App -->
<script src="../../js/adminlte.min.js"></script>
<script src="../../js/layer/layer.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../../js/demo.js"></script>
<!-- page script -->
<script>
    $(function () {
        load();
        $('#example2').DataTable({
            "paging": false,
            "lengthChange": false,
            "searching": false,
            "ordering": true,
            "info": true,
            "autoWidth": false,
            "responsive": true,
        });
    });

    var order_id='${order.id}';
    function jump(page) {
        var keywords=$("[name='keywords']").val();
        location.href="/tourist/list?page="+page+"&keywords="+keywords;
    }

    function toAdd() {
        $.ajax({
            url:"/order/getOutTouristData",
            data:{id:order_id},
            method:"post",
            success:function (data) {
                var html='<div class="row">';
                    html+='     <div class="col-sm-12">';
                    html+='      <div class="form-group">';
                    html+='         <label>选择用户</label>';
                    html+='              <select name="goodsId"  class="form-control goodsId">';

                for (var i = 0; i <data.length ; i++) {
                                    html+='<option value="'+data[i].id +'">'+data[i].touristName +'</option>';
                }
                html+="                     </select>";
                html+="          </div>";
                html+="         </div>";
                html+="     </div>";

                layer.open({
                    type: 1,
                    skin: 'layui-layer-rim', //加上边框
                    area: ['420px', '240px'], //宽高
                    content: html,
                    btn:"提交",
                    yes:function () {
                        var tourist_id=$('.goodsId').val();
                        $.ajax({
                            url:"/order/addTourist",
                            data:{order_id:order_id,tourist_id:tourist_id},
                            method:"post",
                            success:function (data) {
                                location.reload();
                            }
                        });
                    }
                    

                });

            }
        });

    }


    //加载游客数据
    function load() {
        $.ajax({
            url:"/order/getTouristData",
            data:{id:order_id},
            method:"post",
            success:function (data) {
                var html='';
                for (var i = 0; i <data.length ; i++) {
                    html +='<tr>';
                    html +=' <td>'+data[i].id+'</td>';
                    html +=' <td>'+data[i].touristName+'</td>';
                    html +=' <td>'+data[i].touristBirthday+'</td>';
                    html +=' <td>'+data[i].touristPhone+'</td>';
                    html +=' <td>'+data[i].touristIdcard+'</td>';
                    html +=' <td><a href="javascript:delT(\''+data[i].id +'\');">删除</a>';
                    html +='<tr>';
                }
                $("#tbody-data").html(html);

            }
        });

    }

    function delT(id) {
        $.ajax({
            url:"/order/delTourist",
            data:{order_id:order_id,tourist_id:id},
            method:"post",
            success:function (data) {
                location.reload();
            }
        });

    }


</script>
</body>
</html>
